<h2>Bankrekeningen</h2>

<button ng-click="toevoegen()" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-plus"></span></button>

<table class="table table-striped table-condensed" fixed-header table-height="700px">
	<thead>
		<tr>
			<th>rekeningnr</th>
			<th>omschrijving</th>
			<th>saldo</th>
			<th></th>
		</tr>
	</thead>
	<tbody>
		<tr ng-repeat="bankrekening in bankrekeningen">
			<td>{{bankrekening.rekeningnr}}</td>
			<td>{{bankrekening.omschrijving}}</td>
			<td>{{bankrekening.saldo}}</td>
			<td>
		 		<button ng-click="verwijderen($index)" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-trash"></span></button>
		 		<button ng-click="bijwerken($index)" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-pencil"></span></button>
			</td>
		</tr>
	</tbody>
</table>

<script type="text/ng-template" id="bankrekeningModal.html">
	
	<div class="modal-header">
    	<h3 class="modal-title">{{actie}} van een bankrekening</h3>
    </div>
    <div class="modal-body">
		<form id="myform" role="form" ng-submit="save()">
			<div class="form-group">
				<label for="rekeningnr">Rekeningnr:</label>
				<input type="text" id="rekeningnr" class="form-control" ng-model="formObj.rekeningnr" placeholder="Geef het rekeningnummer" size="30" required />
			</div>
			<div class="form-group">
				<label for="omschrijving">Omschrijving:</label>
				<input type="text" id="omschrijving" class="form-control" ng-model="formObj.omschrijving" placeholder="Geef hier een omschrijving" size="50" required />
			</div>
		</form>
    </div>
	<div class="modal-footer">
		<button type="submit" form="myform" class="btn btn-success btn-sm"><span class="glyphicon glyphicon-save"></span></button>
		<button type="reset" ng-click="reset()" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-remove"></span></button>
    </div>
    
</script>
